//  this library.
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:hktk_app/util/font_util.dart';
import 'package:hktk_app/util/view_util.dart';

/// 问题类型数据
const List<String> typeList = ["功能异常", "优化建议", "其他"];

/// 问题类型组件
class ProblemTypeWidget extends StatelessWidget {
  /// 选中的对应下标
  final int index;

  /// 点击返回方法
  final ValueChanged<int> onTapFun;

  const ProblemTypeWidget(
      {super.key, required this.index, required this.onTapFun});

  @override
  Widget build(BuildContext context) {
    return Container(
      // height: 230,
      padding: EdgeInsets.fromLTRB(24, 30, 24, 24),
      decoration: BoxDecoration(
        color: colorWhite1,
        borderRadius: BorderRadius.circular(16),
      ),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _titleItem(),
          SizedBox(height: 10),
          Wrap(
            spacing: 10,
            runSpacing: 8,
            // mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: _showItems(),
          ),
        ],
      ),
    );
  }

  /// 显示标题
  _titleItem() {
    return Text(
      "问题类型",
      style: FontUtil.fontBlack9(26, fontWeight: FontWeight.w500),
    );
  }

  /// 点击方法
  _showItems() {
    List<Widget> widgets = [];

    for (int i = 0; i < typeList.length; i++) {
      String type = typeList[i];
      widgets.add(_showItem(i, type));
    }

    return widgets;
  }

  /// 组件显示
  Widget _showItem(int i, String type) {
    return GestureDetector(
      onTap: () {
        debugPrint("你点击了问题类型 ===> $i");
        if (i != index) {
          onTapFun(i);
        }
      },
      child: i == index ? _selectedItem(type) : _defaultItem(type),
    );
  }

  /// 默认样式
  _defaultItem(String type) {
    return _showContainer(
      color: colorWhite2,
      child: Center(
        child: Text(
          type,
          style: FontUtil.fontBlack10(16),
        ),
      ),
    );
  }

  /// 背景显示
  _showContainer({required Color color, required Widget child}) {
    return Container(
      width: 90,
      height: 60,
      // padding: EdgeInsets.symmetric(horizontal: 10),
      decoration: BoxDecoration(
        color: color,
        borderRadius: BorderRadius.circular(10),
      ),
      child: child,
    );
  }

  /// 选中样式
  _selectedItem(String type) {
    return _showContainer(
      color: colorBlue1,
      child: Container(
        decoration: BoxDecoration(
          color: colorWhite4,
          borderRadius: BorderRadius.circular(10),
          border: Border.all(color: colorBlue1, width: 1),
        ),
        child: Stack(
          children: [
            Center(
              child: Text(
                type,
                style: FontUtil.fontBlack10(16),
              ),
            ),
            // Positioned(
            //   right: 0,
            //   bottom: 0,
            //   child: SvgPicture.asset(
            //     "images/my/problem_type_selected.svg",
            //     width: 34,
            //     height: 22,
            //   ),
            // ),
          ],
        ),
      ),
    );
  }
}
